<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>
<head>
<title>资源管理器</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link type="text/css" rel="stylesheet" href="../widgets/xloadtree/xtree.css" />
<script type="text/javascript" src="../widgets/xloadtree/xtree.js"></script>
<script type="text/javascript" src="../widgets/xloadtree/xmlextras.js"></script>
<script type="text/javascript" src="../widgets/xloadtree/xloadtree.js"></script>
<script
	src="http://libs.baidu.com/mootools/1.4.5/mootools-yui-compressed.js"></script>
<style type="text/css">
body {
	background: white;
	color: black;
}
#popupMenu a{
	font-size:14px;
}
.popupMenu {
	position: absolute;
	left: 400px;
	top: 150px;
	min-width:10px;
	max-width:300px;
	width:auto;
	height:auto;
	z-index:100;
	
    border:3px #EBEBEB solid;
    background-color:#fff;
}
</style>

<script>

function sendHttpRequest(url, params, callback, method, cache){
	var myRequest = new Request({
		url:url, method:method||'get',
		onSuccess: function(responseText, responseXML){
			if(callback){
				callback(true, responseText);
			}
		},
		onFailure: function(req){
			if(callback){
				callback(false, req);
			}
		},
		onException: function(headerName, value){
			if(callback){
				callback(false, headerName+'='+value);
			}
		}
	});
	if(!cache){
		params['_'] = ((new Date()).getTime());
	}
	myRequest.send({'data':params});
}

function ajaxRequest(url, values, callback){
	var interceptor=function(success, responseText){
		var result = eval("("+responseText+")");
		if(!success){
			alert('网络请求错误！');
		}else if(result.code=='0000'){
			callback(result.data);
		}else{
			alert(result.message);
		}
	}
	sendHttpRequest(url, values, interceptor);
}

/////////////////////////////////

function setPopupmenu() {
	///////////////////////////////////////////////////
	//document.oncontextmenu = function (){return false;}
	
	document.onmousedown1 = function(e){
	    var menu = $('popupMenu');
	    var target = e.target||e.srcElement;
	    if(e.button==2){
	        menu.setAttribute('class','popupMenu');
	        menu.style.display = '';
	        menu.style.top = (e.clientY+'px');
	        menu.style.left = (e.clientX+'px');
	       	
	    }else{
	        if(target!=menu && target.parentNode!=menu){
	        	menu.style.display = 'none';
	        }
	    }
	};
}

////////////////////////////////////////

var URLPREFIX ;
var ROOT = '/';
var currentUrl = null;

function showPopupMenu(target){
	var id = target.id;
	var sa = id.split('-',4);
	var itemId = '';
	for(var i=0;i<sa.length;i++){
		itemId += '-'+sa[i];
	}
	itemId = itemId.substr(1);
	var menuItem = webFXTreeHandler.all[itemId];
	alert(menuItem.src);
}

function menuAction() {
    var node = tree.getSelected();
    viewCurrentNode(node);

}

function viewCurrentNode(node){
	currentUrl = node.src.split('?')[0];

}

function getFullPath(node) {
    var curNode = node;
    var path = '';
    while (curNode && !curNode.tree) {
        if (curNode.text != '/') {
            path = '/' + curNode.text + path;
        }
        curNode = curNode.parentNode;
    };
    return path;
}

//override xtree function
function _startLoadXmlTree(sSrc, jsNode) {
	if (jsNode.loading || jsNode.loaded)
		return;
	jsNode.loading = true;
	var xmlHttp = XmlHttp.create();
	xmlHttp.open("GET", sSrc, true);	// async
	xmlHttp.onreadystatechange = function () {
		if (xmlHttp.readyState == 4) {
			var oXmlDoc = xmlHttp.responseXML;
			var root = oXmlDoc.documentElement;
			if(root.tagName=='error'){
				alert(root.getAttribute("msg"));
				return;
			}
			_xmlFileLoaded(oXmlDoc, jsNode);
		}
	};
	// call in new thread to allow ui to update
	window.setTimeout(function () {
		xmlHttp.send(null);
	}, 10);
}

var tree;

function initTree(){
    webFXTreeConfig.rootIcon = "../widgets/xloadtree/images/xp/folder.png";
    webFXTreeConfig.openRootIcon = "../widgets/xloadtree/images/xp/openfolder.png";
    webFXTreeConfig.folderIcon = "../widgets/xloadtree/images/xp/folder.png";
    webFXTreeConfig.openFolderIcon = "../widgets/xloadtree/images/xp/openfolder.png";
    webFXTreeConfig.fileIcon = "../widgets/xloadtree/images/xp/file.png";
    webFXTreeConfig.lMinusIcon = "../widgets/xloadtree/images/xp/Lminus.png";
    webFXTreeConfig.lPlusIcon = "../widgets/xloadtree/images/xp/Lplus.png";
    webFXTreeConfig.tMinusIcon = "../widgets/xloadtree/images/xp/Tminus.png";
    webFXTreeConfig.tPlusIcon = "../widgets/xloadtree/images/xp/Tplus.png";
    webFXTreeConfig.iIcon = "../widgets/xloadtree/images/xp/I.png";
    webFXTreeConfig.lIcon = "../widgets/xloadtree/images/xp/L.png";
    webFXTreeConfig.tIcon = "../widgets/xloadtree/images/xp/T.png";
    webFXTreeConfig.blankIcon = "../widgets/xloadtree/images/blank.png";
    webFXTreeConfig.usePersistence = false;

    var url = URLPREFIX+ROOT+"?method=getChildren";
    tree = new WebFXTree("zkmanager");
    tree.add(new WebFXLoadTreeItem(ROOT, url, "javascript:menuAction()"));

    $('treeContainer').innerHTML = tree;
}

window.addEvent('domready', function() {
	ajaxRequest('userinfo', {}, function(data){
		ROOT = data.userRoot;
		URLPREFIX = data.urlPrefix;
		initTree();
	});
});

</script>

</head>
<body>

<table width="100%">
      <tr>
        <td valign="top" width="260px" style="overflow:auto">
            <div id="treeContainer"></div>
        </td>
        <td>
			<div id="mainFrame"
				style="height: 800px; border: 1px solid #DDDDDD;">
				<div id="popupMenu" style="display:; border: 1px solid #DDDDDD; background-color: #F0F0F0;">
					<a href="javascript:addZkNode();">添加节点</a> 
					<a href="javascript:delZkNode();">删除节点</a> 
					<a href="javascript:setZkNodeData();">设置节点数据</a>
				</div>
				<div><br/></div>
				<div id="mainPanel">
                    <div>
                        <span style="float:left; width:50px">
                            path:
                        </span>
                        <span id="node_url" style="float:left"></span>
                    </div>
                    <div style="clear:both">
                      <span style="float:left; width:50px">data:</span>
                      <span style="float:left">
                        <textarea id="node_data" cols="60" rows="6"></textarea>
                      </span>
                    </div>
                    
			  </div>
			</div>
		</td>
  </tr>
</table>
</body>
</html>
